<template>
  <el-dialog class="dialog-main" :title="title" :visible.sync="dialogVisible" :destroy-on-close="destroyOnClose" :before-close="beforeClose" v-bind="$attrs" v-on="$listeners">
    <div class="dialog-content">
      <slot></slot>
    </div>
    <span slot="footer" class="dialog-footer">
      <EvButton v-if="showCancel" @click="handleCancel">{{
        $attrs.cancelText
          ? $attrs.cancelText
          : $t("common.common_operation_cancel")
      }}</EvButton>
      <EvButton v-if="showConfirm" type="primary" @click="handleConfirm">{{
        $attrs.confirmText
          ? $attrs.confirmText
          : $t("common.common_operation_confirm")
      }}</EvButton>
    </span>
  </el-dialog>
</template>
<script>

export default {
  props: {
    dialogVisible: {
      type: Boolean,
      default: false
    },
    destroyOnClose: {
      type: Boolean,
      default: true
    },
    showCancel: {
      type: Boolean,
      default: true
    },
    showConfirm: {
      type: Boolean,
      default: true
    },
    title: {
      type: String,
      default: '提示'
    }
  },
  data() {
    return {

    }
  },
  methods: {
    // drawer自身关闭事件
    beforeClose(done) {
      this.$emit('handleClose', done)
    },
    // 取消点击事件
    handleCancel() {
      this.$emit('handleCancel')
    },
    // 确认点击事件
    handleConfirm() {
      this.$emit('handleConfirm')
    }
  }
}
</script>
<style lang="scss" scoped>
::v-deep.dialog-main {
  .el-dialog__body {
    padding: 0;
  }
  .dialog-content {
    min-height: 100%;
    padding: 12px 20px 12px 20px;
  }
}
</style>